<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="vue.js"></script>
</head>
<body>
    <div id="app">
        <!-- item代表的是每一项数组 -->
        <!-- index代表索引 -->
        <!-- :key='item.id 唯一的标识 -->
        <ul>
            <li v-for="(item,index) in user "::key="item.id">{{index}}
{{item.username}}
            </li>
        </ul>
        <script>
            let vm=new Vue({
                el:"#app",
                data:{
                    user:[
                        {
                            id:1,
                            username:"arong",
                            age:18
                        },
                        {
                            id:2,
                            username:"占山",
                            age:19
                        },
                        {
                            id:3,
                            username:"李白",
                            age:20
                        },
                        {
                            id:4,
                            username:"力宏",
                            age:21
                        }
                    ]
                }
            })
        </script>
    </div>
</body>
</html>